<template>
  <div>
    <!-- 对数组遍历 -->
    <div>
      <ul>
        <li v-for="(val, index) in arr">{{ index }} - {{ val }}</li>
      </ul>
    </div>

    <!-- 对数组对象遍历 -->
    <div>
      <ul>
        <li v-for="obj in stuArr">
          <span>{{ obj.name }}</span>
          <span>{{ obj.sex }}</span>
          <span>{{ obj.hobby }}</span>
        </li>
      </ul>
    </div>

    <!-- 遍历对象 -->
    <div v-for="(value, key) in tObj">{{ key }}--{{ value }}</div>

    <!-- 遍历整数 -->
    <div v-for="c in count">
      {{ c }}
    </div>

    <!-- 遍历字符串 -->
    <div v-for="s in str">
      {{ s }}
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      arr: ["小明", "小欢欢", "大黄"],
      stuArr: [
        {
          id: 1001,
          name: "孙悟空",
          sex: "男",
          hobby: "吃桃子",
        },
        {
          id: 1002,
          name: "猪八戒",
          sex: "男",
          hobby: "背媳妇",
        },
      ],
      tObj: {
        name: "小黑",
        age: 18,
        class: "1期",
      },
      count: 10,
      str: "ahijfhagfashfa",
    };
  },
};
</script>

<style>
</style>